import 'dart:math';

import 'package:confetti/confetti.dart';
import 'package:flutter/material.dart';
import 'package:flutter_widget_from_html_core/flutter_widget_from_html_core.dart';
import 'package:get/get.dart';

import 'PlaceController.dart';
import 'PlacePlayerWidget.dart';

class PlaceStepFour extends GetView<PlaceController> {
  const PlaceStepFour({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    Future.delayed(Duration(milliseconds: 500), () {
      controller.controllerCenter.play();
    });
    String audioUrl =
        'https://ichinsereader-prod.s3.amazonaws.com/content/media/placement/audio/level${controller.level}.mp3';
    String text = '<p>Congratulations! You have arrived at a placement of '
        '<span style="color:#28a745">Level ${controller.level}</span>! '
        '<span>(This level is adjustable)</span></p>'
        '<p>To make reading more fun, we suggest that you start with '
        '<span style="color:#28a745">Level ${controller.levelRange}</span> books!</p>'
        '<p>You can always read any level book with '
        '<a style="color:#28a745" href="openReading">Open Reading</a> too.</p>';

    return Stack(
      children: [
        Align(
          alignment: Alignment.center,
          child: ConfettiWidget(
              confettiController: controller.controllerCenter,
              blastDirectionality: BlastDirectionality.explosive,
              emissionFrequency: 0.03,
              shouldLoop: true,
              createParticlePath: drawStar),
        ),
        Column(children: [
          HtmlWidget(text, onTapUrl: (url) {
            if (url == 'openReading') {
              Future.delayed(Duration(milliseconds: 500), () {
                if (controller.isStudent) {
                  Get.offAllNamed('/student/library');
                  Get.delete<PlaceController>();
                } else {
                  Get.offAllNamed('/individual/library');
                  Get.delete<PlaceController>();
                }
              });
            }
            return false;
          },
              textStyle: TextStyle(
                  fontSize: 22,
                  color: Color(0xff212529),
                  height: 1.5,
                  fontWeight: FontWeight.w900,
                  wordSpacing: 1.5)),
          SizedBox(height: 10),
          PlacePlayerWidget(audioUrl: audioUrl, iconSize: 50),
          SizedBox(height: 20),
          MaterialButton(
              minWidth: 140,
              height: 45,
              color: Color(0xffD2E5B5),
              textColor: Color(0xff4FA397),
              child: Text('Test Finished',
                  style: TextStyle(fontSize: 18, fontWeight: FontWeight.w900)),
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(6.0),
                  side: BorderSide(
                    color: Color(0xff8AAAA4),
                  )),
              onPressed: () {
                Future.delayed(Duration(milliseconds: 500), () {
                  if (controller.isStudent) {
                    Get.offAllNamed('/student/home');
                    Get.delete<PlaceController>();
                  } else {
                    Get.offAllNamed('/individual/home');
                    Get.delete<PlaceController>();
                  }
                });
              })
        ])
      ],
    );
  }

  Path drawStar(Size size) {
    // Method to convert degree to radians
    double degToRad(double deg) => deg * (pi / 180.0);

    const numberOfPoints = 5;
    final halfWidth = size.width / 2;
    final externalRadius = halfWidth;
    final internalRadius = halfWidth / 2.5;
    final degreesPerStep = degToRad(360 / numberOfPoints);
    final halfDegreesPerStep = degreesPerStep / 2;
    final path = Path();
    final fullAngle = degToRad(360);
    path.moveTo(size.width, halfWidth);

    for (double step = 0; step < fullAngle; step += degreesPerStep) {
      path.lineTo(halfWidth + externalRadius * cos(step),
          halfWidth + externalRadius * sin(step));
      path.lineTo(halfWidth + internalRadius * cos(step + halfDegreesPerStep),
          halfWidth + internalRadius * sin(step + halfDegreesPerStep));
    }
    path.close();
    return path;
  }
}
